<template>
	<view>
		<navBar title="个人信息"></navBar>
		<view class="top-bg"></view>
		<view class="content">
			<view class="item" @click="handleAvatar">
				<view class="left">头像</view>
				<view class="right">
					<image class="avatar" :src="headImgUrl || ''"></image>
				</view>
			</view>
			<view class="item" @click="open">
				<view class="left">昵称</view>
				<view class="right">
					<text>{{nickname || ''}}</text>
					<u-icon name="arrow-right" color="#B1B1B1"></u-icon>
				</view>
			</view>
			<view class="item" @click="go('/pages/indoor/bindphone')">
				<view class="left">手机号码</view>
				<view class="right">
					<text>{{phoneNumber || ''}}</text>
					<u-icon name="arrow-right" color="#B1B1B1"></u-icon>
				</view>
			</view>
		</view>
		<u-popup :closeable="false"
		v-model="popShows" 
		mode="center" 
		:border-radius="44" 
		width="552" >
			<view class="popup-content">
				<view class="popup-content-title">更换昵称</view>
				<input class="nickname-input" v-model="name" placeholder="请输入昵称" />
				<view class="actions">
					<view class="actions-btn cancel" @click="close">取消</view>
					<view class="actions-btn confirm" @click="handleUpdateUser">确定</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import personal from './js/personal'
	
	export default {
		components: {
		  
		},
		...personal
	}
	
</script>

<style lang="less" scoped>
	@import url('./css/personal.less');
</style>